<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <title>批量导入</title>
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <link rel="stylesheet" href="../../yl/index.css" />
  <link rel="stylesheet" href="../../style/index.css" />
</head>

<body>
  <div id="app" v-cloak>
    <div class="title">
      <el-button style="margin: 0; margin-right: 10px" :disabled="loading" type="danger" @click="goBack">返回</el-button>
      <el-button style="margin: 0; margin-right: 10px" :disabled="loading" type="warning"
        @click="downloadTemplate">下载导入模板</el-button>
      <el-upload class="upload-demo" style="display: inline-block" ref="upload" action="" accept=".xls,.xlsx"
        :on-change="(file,row)=>{this.handleUpload(file,row)}" :show-file-list="false" :auto-upload="false">
        <el-button style="margin: 0; margin-right: 10px" :disabled="loading" type="primary"
          slot="trigger">选择文件</el-button>
      </el-upload>
      <el-button style="margin: 0; margin-right: 10px" :disabled="loading" type="success"
        @click="submitUpload(0)">上传</el-button>
      <el-button style="margin: 0; margin-right: 10px" :disabled="loading" type="danger"
        @click="handleClean">清空</el-button>
      <el-badge :value="success" style="margin-left: 10px" class="item" type="success">
        <el-button>成功</el-button>
      </el-badge>
      <el-badge style="margin-left: 10px" :value="error" class="item">
        <el-button>失败</el-button>
      </el-badge>
    </div>
    <div class="body">
      <el-table :data="tableData.slice((form.page-1)*form.limit,form.page*form.limit)" stripe border style="width: 100%"
        height="calc(100vh - 180px)" :expand-all="true">
        <el-table-column type="index" width="60" align="center" label="序号"></el-table-column>
        <el-table-column label="身份证编号" width="250" align="center" prop="ID_Card_Number">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.ID_Card_Number"></el-input>
            <span v-else>{{row.ID_Card_Number}}</span>
          </template>
        </el-table-column>
        <el-table-column label="姓名" align="center" prop="Personal_Name">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Personal_Name"></el-input>
            <span v-else>{{row.Personal_Name}}</span>
          </template>
        </el-table-column>
        <el-table-column label="性别" align="center" prop="Gender">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Gender"></el-input>
            <span v-else>{{row.Gender}}</span>
          </template>
        </el-table-column>
        <el-table-column label="出生日期" align="center" width="250" prop="Birthday">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Birthday"></el-input>
            <span v-else>{{row.Birthday}}</span>
          </template>
        </el-table-column>
        <el-table-column label="户籍地" width="250" align="center" prop="Registered_Residence">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Registered_Residence"></el-input>
            <span v-else>{{row.Registered_Residence}}</span>
          </template>
        </el-table-column>
        <el-table-column label="户籍地归属省编号" align="center" width="250" prop="RR_Province_Number">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.RR_Province_Number"></el-input>
            <span v-else>{{row.RR_Province_Number}}</span>
          </template>
        </el-table-column>
        <el-table-column label="户籍地归属市编号" align="center" width="250" prop="RR_City_Number">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.RR_City_Number"></el-input>
            <span v-else>{{row.RR_City_Number}}</span>
          </template>
        </el-table-column>
        <el-table-column label="户籍地归属区/县编号" align="center" width="250" prop="RR_County_Nubmer">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.RR_County_Nubmer"></el-input>
            <span v-else>{{row.RR_County_Nubmer}}</span>
          </template>
        </el-table-column>
        <el-table-column label="户籍地归属乡/镇/街道编号" align="center" width="250" prop="RR_Town_Number">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.RR_Town_Number"></el-input>
            <span v-else>{{row.RR_Town_Number}}</span>
          </template>
        </el-table-column>
        <el-table-column label="村" width="250" align="center" prop="RR_Village_Number">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.RR_Village_Number"></el-input>
            <span v-else>{{row.RR_Village_Number}}</span>
          </template>
        </el-table-column>
        <el-table-column label="政治面貌" align="center" width="250" prop="Political_Affiliation">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Political_Affiliation"></el-input>
            <span v-else>{{row.Political_Affiliation}}</span>
          </template>
        </el-table-column>
        <el-table-column label="家庭地址" width="300" align="center" prop="Home_Address">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Home_Address"></el-input>
            <span v-else>{{row.Home_Address}}</span>
          </template>
        </el-table-column>
        <el-table-column label="民族" align="center" prop="Nation">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Nation"></el-input>
            <span v-else>{{row.Nation}}</span>
          </template>
        </el-table-column>
        <el-table-column label="人口类型（0:户籍人口  1:外来人口）" align="center" width="250" prop="Migrant_Personal">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Migrant_Personal"></el-input>
            <span v-else>{{row.Migrant_Personal}}</span>
          </template>
        </el-table-column>
        <el-table-column label="流动人口 （0:否 1:是）" align="center" width="250" prop="Flow_Personal">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Flow_Personal"></el-input>
            <span v-else>{{row.Flow_Personal}}</span>
          </template>
        </el-table-column>
        <!-- <el-table-column
            label="重点关注 （0:否 1:是）"
            width="250"
            align="center"
            prop="Focus"
          >
            <template v-slot="{row}">
              <el-input v-if="row.isEdit" v-model="row.Focus"></el-input>
              <span v-else>{{row.Focus}}</span>
            </template>
          </el-table-column> -->
        <el-table-column label="联系电话" width="250" align="center" prop="Contact_Phone">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Contact_Phone"></el-input>
            <span v-else>{{row.Contact_Phone}}</span>
          </template>
        </el-table-column>
        <el-table-column label="认领岗位编号" width="250" align="center" prop="Party_Member_Position_SerialNumber">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Party_Member_Position_SerialNumber"></el-input>
            <span v-else>{{row.Party_Member_Position_SerialNumber}}</span>
          </template>
        </el-table-column>
        <el-table-column label="入党日期" width="250" align="center" prop="Joining_Date">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Joining_Date"></el-input>
            <span v-else>{{row.Joining_Date}}</span>
          </template>
        </el-table-column>
        <el-table-column label="转正日期" width="250" align="center" prop="Conformation_Date">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Conformation_Date"></el-input>
            <span v-else>{{row.Conformation_Date}}</span>
          </template>
        </el-table-column>
        <el-table-column label="所属党组织编号" width="250" align="center" prop="Party_Organization_SerialNumber">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Party_Organization_SerialNumber"></el-input>
            <span v-else>{{row.Party_Organization_SerialNumber}}</span>
          </template>
        </el-table-column>
        <el-table-column label="党员类型编号" width="250" align="center" prop="Party_Member_Category_SerialNumber">
          <template v-slot="{row}">
            <el-input v-if="row.isEdit" v-model="row.Party_Member_Category_SerialNumber"></el-input>
            <span v-else>{{row.Party_Member_Category_SerialNumber}}</span>
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center" width="100">
          <template v-slot="{row}">
            <el-tag :type="row.isStatus === '1' ? 'success' : row.isStatus === '2' ? 'danger' : 'info'">{{ row.isStatus
              === '1' ? '成功' : row.isStatus === '2' ?
              '失败' : '待导入' }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="原因说明" align="center" width="150">
          <template v-slot="{row}"> {{row.Cause}} </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="180">
          <template v-slot="{row,$index}">
            <el-button size="small" :disabled="loading" :type="row.isEdit?'success':'primary'"
              @click="handleEdit(row)">{{row.isEdit?'保存':'修改'}}
            </el-button>
            <el-button size="small" :disabled="loading" type="danger" @click="handleRemove($index)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
      :current-page="form.page" :page-sizes="[15, 30 , 60 ,100, 200, 300, 400]" :page-size="form.limit"
      layout="total, sizes, prev, pager, next, jumper" :total="tableData.length">
    </el-pagination>
    <!-- 选择工作簿的弹窗 -->
    <el-dialog title="请选择要上传的工作簿" v-model="dialogFormVisible">
      <!-- 弹窗内表单：对应修改后的dialogForm -->
      <el-form :model="dialogForm" style="margin-block: 35px">
        <el-form-item label="工作簿" :label-width="formLabelWidth">
          <!-- 单个选择框，绑定选中值 -->
          <el-select v-model="dialogForm.selectedWorkbook" placeholder="请选择工作簿" style="width: 100%">
            <!-- 循环工作簿列表生成选项 -->
            <el-option v-for="(sheetName, index) in workbookList" :key="index" :label="sheetName"
              :value="sheetName"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <!-- 底部按钮：关闭弹窗逻辑不变 -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
  <script src="../../utils/utils.js"></script>
  <script src="../../config/config.js"></script>
  <script src="../../utils/mixins.js"></script>
  <script src="../../yl/vue.js"></script>
  <script src="../../yl/index.js"></script>
  <script src="../../yl/zh-cn.mjs"></script>
  <script src="../../yl/index.iife.min.js"></script>
  <script src="../../yl/jquery.min.js"></script>
  <script src="../../utils/jquery.cookie.js"></script>
  <script src="../../api/request.js"></script>
  <script src="../../utils/ID_Validity.js"></script>
  <script src="../../utils/xlsx.full.min.js"></script>
  <script type="text/javascript" src="js/import.js"></script>
</body>

</html>